.variable-toolbar {
  height: 100%;
  display: flex;
  flex-direction: column;
  background-color: $g3-castle;
  font-size: 13px;
}

.variables-toolbar--list {
  padding-bottom: $ix-marg-a;
}

.variables-toolbar--item {
  position: relative;
}

.variables-toolbar--label,
.variables-toolbar--separator {
  height: 30px;
  display: flex;
  align-items: center;
  padding-left: $ix-marg-b;
}

.variables-toolbar--label {
  font-family: 'RobotoMono', monospace;
  cursor: pointer;

  &:hover,
  &:active {
    background-color: $g4-onyx;
    color: $c-laser;
  }
}

.variables-toolbar--separator {
  background-color: $g6-smoke;
  font-weight: 600;
  color: $g18-cloud;
}

.variable-tooltip--contents .form--element {
  margin-bottom: 0;
}
